<!DOCTYPE html>



  


<html class="theme-next pisces use-motion" lang="zh-Hans">
<head>
  <meta charset="UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<meta name="theme-color" content="#222">









<meta http-equiv="Cache-Control" content="no-transform" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
















  
  
  <link href="/reimupage/lib/fancybox/source/jquery.fancybox.css?v=2.1.5" rel="stylesheet" type="text/css" />







<link href="/reimupage/lib/font-awesome/css/font-awesome.min.css?v=4.6.2" rel="stylesheet" type="text/css" />

<link href="/reimupage/css/main.css?v=5.1.4" rel="stylesheet" type="text/css" />


  <link rel="apple-touch-icon" sizes="180x180" href="/reimupage/images/apple-touch-icon-next.png?v=5.1.4">


  <link rel="icon" type="image/png" sizes="32x32" href="/reimupage/images/favicon-32x32-next.png?v=5.1.4">


  <link rel="icon" type="image/png" sizes="16x16" href="/reimupage/images/favicon-16x16-next.png?v=5.1.4">


  <link rel="mask-icon" href="/reimupage/images/logo.svg?v=5.1.4" color="#222">





  <meta name="keywords" content="JavaScript,String," />










<meta name="description" content="String对象 笔记 前言本系列为学习过程中知识的整理，学习笔记，资料均来源于网络 正文 一、String实例方法1.1 String.prototype.charAt()返回指定位置的字符，参数是从0开始编号的位置。1234var s = new String(&apos;abc&apos;);s.charAt(1) // &quot;b&quot;s.charAt(s.length - 1) // &quot;c&quot; 这个方法可以用数组下标替">
<meta name="keywords" content="JavaScript,String">
<meta property="og:type" content="article">
<meta property="og:title" content="String对象 笔记">
<meta property="og:url" content="http://hatsunem1ku.gitee.io/reimupage/2018/05/07/String对象/index.html">
<meta property="og:site_name" content="Reimu&#39;Blog">
<meta property="og:description" content="String对象 笔记 前言本系列为学习过程中知识的整理，学习笔记，资料均来源于网络 正文 一、String实例方法1.1 String.prototype.charAt()返回指定位置的字符，参数是从0开始编号的位置。1234var s = new String(&apos;abc&apos;);s.charAt(1) // &quot;b&quot;s.charAt(s.length - 1) // &quot;c&quot; 这个方法可以用数组下标替">
<meta property="og:locale" content="zh-Hans">
<meta property="og:updated_time" content="2018-05-07T01:00:58.679Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="String对象 笔记">
<meta name="twitter:description" content="String对象 笔记 前言本系列为学习过程中知识的整理，学习笔记，资料均来源于网络 正文 一、String实例方法1.1 String.prototype.charAt()返回指定位置的字符，参数是从0开始编号的位置。1234var s = new String(&apos;abc&apos;);s.charAt(1) // &quot;b&quot;s.charAt(s.length - 1) // &quot;c&quot; 这个方法可以用数组下标替">



<script type="text/javascript" id="hexo.configurations">
  var NexT = window.NexT || {};
  var CONFIG = {
    root: '/reimupage/',
    scheme: 'Pisces',
    version: '5.1.4',
    sidebar: {"position":"left","display":"post","offset":12,"b2t":false,"scrollpercent":false,"onmobile":false},
    fancybox: true,
    tabs: true,
    motion: {"enable":true,"async":false,"transition":{"post_block":"fadeIn","post_header":"slideDownIn","post_body":"slideDownIn","coll_header":"slideLeftIn","sidebar":"slideUpIn"}},
    duoshuo: {
      userId: '0',
      author: '博主'
    },
    algolia: {
      applicationID: '',
      apiKey: '',
      indexName: '',
      hits: {"per_page":10},
      labels: {"input_placeholder":"Search for Posts","hits_empty":"We didn't find any results for the search: ${query}","hits_stats":"${hits} results found in ${time} ms"}
    }
  };
</script>



  <link rel="canonical" href="http://hatsunem1ku.gitee.io/reimupage/2018/05/07/String对象/"/>





  <title>String对象 笔记 | Reimu'Blog</title>
  








</head>

<body itemscope itemtype="http://schema.org/WebPage" lang="zh-Hans">

  
  
    
  

  <div class="container sidebar-position-left page-post-detail">
    <div class="headband"></div>

    <header id="header" class="header" itemscope itemtype="http://schema.org/WPHeader">
      <div class="header-inner"><div class="site-brand-wrapper">
  <div class="site-meta ">
    

    <div class="custom-logo-site-title">
      <a href="/reimupage/"  class="brand" rel="start">
        <span class="logo-line-before"><i></i></span>
        <span class="site-title">Reimu'Blog</span>
        <span class="logo-line-after"><i></i></span>
      </a>
    </div>
      
        <p class="site-subtitle">求知若饥 虚心若愚</p>
      
  </div>

  <div class="site-nav-toggle">
    <button>
      <span class="btn-bar"></span>
      <span class="btn-bar"></span>
      <span class="btn-bar"></span>
    </button>
  </div>
</div>

<nav class="site-nav">
  

  
    <ul id="menu" class="menu">
      
        
        <li class="menu-item menu-item-home">
          <a href="/reimupage/" rel="section">
            
              <i class="menu-item-icon fa fa-fw fa-home"></i> <br />
            
            首页
          </a>
        </li>
      
        
        <li class="menu-item menu-item-about">
          <a href="/reimupage/about/" rel="section">
            
              <i class="menu-item-icon fa fa-fw fa-user"></i> <br />
            
            关于
          </a>
        </li>
      
        
        <li class="menu-item menu-item-tags">
          <a href="/reimupage/tags/" rel="section">
            
              <i class="menu-item-icon fa fa-fw fa-tags"></i> <br />
            
            标签
          </a>
        </li>
      
        
        <li class="menu-item menu-item-categories">
          <a href="/reimupage/categories/" rel="section">
            
              <i class="menu-item-icon fa fa-fw fa-th"></i> <br />
            
            分类
          </a>
        </li>
      
        
        <li class="menu-item menu-item-archives">
          <a href="/reimupage/archives/" rel="section">
            
              <i class="menu-item-icon fa fa-fw fa-archive"></i> <br />
            
            归档
          </a>
        </li>
      

      
    </ul>
  

  
</nav>



 </div>
    </header>

    <main id="main" class="main">
      <div class="main-inner">
        <div class="content-wrap">
          <div id="content" class="content">
            

  <div id="posts" class="posts-expand">
    

  

  
  
  

  <article class="post post-type-normal" itemscope itemtype="http://schema.org/Article">
  
  
  
  <div class="post-block">
    <link itemprop="mainEntityOfPage" href="http://hatsunem1ku.gitee.io/reimupage/reimupage/2018/05/07/String对象/">

    <span hidden itemprop="author" itemscope itemtype="http://schema.org/Person">
      <meta itemprop="name" content="Reimu">
      <meta itemprop="description" content="">
      <meta itemprop="image" content="/reimupage/images/avatar.gif">
    </span>

    <span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
      <meta itemprop="name" content="Reimu'Blog">
    </span>

    
      <header class="post-header">

        
        
          <h1 class="post-title" itemprop="name headline">String对象 笔记</h1>
        

        <div class="post-meta">
          <span class="post-time">
            
              <span class="post-meta-item-icon">
                <i class="fa fa-calendar-o"></i>
              </span>
              
                <span class="post-meta-item-text">发表于</span>
              
              <time title="创建于" itemprop="dateCreated datePublished" datetime="2018-05-07T15:40:55+08:00">
                2018-05-07
              </time>
            

            

            
          </span>

          
            <span class="post-category" >
            
              <span class="post-meta-divider">|</span>
            
              <span class="post-meta-item-icon">
                <i class="fa fa-folder-o"></i>
              </span>
              
                <span class="post-meta-item-text">分类于</span>
              
              
                <span itemprop="about" itemscope itemtype="http://schema.org/Thing">
                  <a href="/reimupage/categories/JavaScript/" itemprop="url" rel="index">
                    <span itemprop="name">JavaScript</span>
                  </a>
                </span>

                
                
              
            </span>
          

          
            
          

          
          

          

          

          

        </div>
      </header>
    

    
    
    
    <div class="post-body" itemprop="articleBody">

      
      

      
        <h1 id="String对象-笔记"><a href="#String对象-笔记" class="headerlink" title="String对象 笔记"></a>String对象 笔记</h1><hr>
<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><p>本系列为学习过程中知识的整理，学习笔记，资料均来源于网络</p>
<h1 id="正文"><a href="#正文" class="headerlink" title="正文"></a>正文</h1><hr>
<h2 id="一、String实例方法"><a href="#一、String实例方法" class="headerlink" title="一、String实例方法"></a>一、String实例方法</h2><h3 id="1-1-String-prototype-charAt"><a href="#1-1-String-prototype-charAt" class="headerlink" title="1.1 String.prototype.charAt()"></a>1.1 String.prototype.charAt()</h3><p>返回指定位置的字符，参数是从0开始编号的位置。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> s = <span class="keyword">new</span> <span class="built_in">String</span>(<span class="string">'abc'</span>);</span><br><span class="line"></span><br><span class="line">s.charAt(<span class="number">1</span>) <span class="comment">// "b"</span></span><br><span class="line">s.charAt(s.length - <span class="number">1</span>) <span class="comment">// "c"</span></span><br></pre></td></tr></table></figure></p>
<p>这个方法可以用数组下标替代。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'abc'</span>.charAt(<span class="number">1</span>) <span class="comment">// "b"</span></span><br><span class="line"><span class="string">'abc'</span>[<span class="number">1</span>] <span class="comment">// "b"</span></span><br></pre></td></tr></table></figure></p>
<p>如果参数为负数，或大于等于字符串的长度，charAt返回空字符串。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'abc'</span>.charAt(<span class="number">-1</span>) <span class="comment">// ""</span></span><br><span class="line"><span class="string">'abc'</span>.charAt(<span class="number">3</span>) <span class="comment">// ""</span></span><br></pre></td></tr></table></figure></p>
<h3 id="1-2-String-prototype-charCodeAt"><a href="#1-2-String-prototype-charCodeAt" class="headerlink" title="1.2 String.prototype.charCodeAt()"></a>1.2 String.prototype.charCodeAt()</h3><p>返回字符串指定位置的Unicode码点（十进制表示），相当于String.fromCharCode()的逆操作。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'abc'</span>.charCodeAt(<span class="number">1</span>)  <span class="comment">//98</span></span><br></pre></td></tr></table></figure></p>
<p>如果没有任何参数，charCodeAt返回首字符的 Unicode 码点。</p>
<p>如果参数为负数，或大于等于字符串的长度，charCodeAt返回NaN。</p>
<h3 id="1-3-String-prototype-concat"><a href="#1-3-String-prototype-concat" class="headerlink" title="1.3 String.prototype.concat()"></a>1.3 String.prototype.concat()</h3><p>用于连接两个字符串，返回一个新字符串，<strong>不改变原字符串</strong><br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">var</span> s1 = <span class="string">'abc'</span>;</span><br><span class="line"><span class="keyword">var</span> s2 = <span class="string">'def'</span>;</span><br><span class="line">s1.concat(s2) <span class="comment">// "abcdef"</span></span><br><span class="line">s1 <span class="comment">// "abc"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//该方法可以接受多个参数</span></span><br><span class="line"><span class="string">'a'</span>.concat(<span class="string">'b'</span>,<span class="string">'c'</span>)  <span class="comment">//  "abc"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果参数不是字符串，concat会将其先转为字符串，然后连接</span></span><br><span class="line"><span class="keyword">var</span> one = <span class="number">1</span>;</span><br><span class="line"><span class="keyword">var</span> two = <span class="number">2</span>;</span><br><span class="line"><span class="keyword">var</span> three = <span class="string">'3'</span>;</span><br><span class="line"></span><br><span class="line"><span class="string">''</span>.concat(one, two, three) <span class="comment">// "123"</span></span><br><span class="line">one + two + three <span class="comment">// "33"</span></span><br></pre></td></tr></table></figure></p>
<h3 id="1-4-String-prototype-slice"><a href="#1-4-String-prototype-slice" class="headerlink" title="1.4 String.prototype.slice()"></a>1.4 String.prototype.slice()</h3><p>用于从原字符串取出子字符串并返回，<strong>不改变原字符串</strong>，<br>第一个参数是子字符串的开始位置，<br>第二个参数是子字符串的结束位置（不含该位置）。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'JavaScript'</span>.slice(<span class="number">0</span>, <span class="number">4</span>) <span class="comment">// "Java"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果省略第二个参数，则表示子字符串一直到原字符串结束。</span></span><br><span class="line"><span class="string">'JavaScript'</span>.slice(<span class="number">4</span>) <span class="comment">// "Script"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果参数是负值，表示从结尾开始倒数计算的位置，即该负值加上字符串长度。</span></span><br><span class="line"><span class="string">'JavaScript'</span>.slice(<span class="number">-6</span>) <span class="comment">// "Script"</span></span><br><span class="line"><span class="string">'JavaScript'</span>.slice(<span class="number">0</span>, <span class="number">-6</span>) <span class="comment">// "Java"</span></span><br><span class="line"><span class="string">'JavaScript'</span>.slice(<span class="number">-2</span>, <span class="number">-1</span>) <span class="comment">// "p"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果第一个参数大于第二个参数，slice方法返回一个空字符串。</span></span><br><span class="line"><span class="string">'JavaScript'</span>.slice(<span class="number">2</span>, <span class="number">1</span>) <span class="comment">// ""</span></span><br></pre></td></tr></table></figure></p>
<h3 id="1-5-String-prototype-substring"><a href="#1-5-String-prototype-substring" class="headerlink" title="1.5 String.prototype.substring()"></a>1.5 String.prototype.substring()</h3><p>用于从原字符串取出子字符串并返回，<strong>不改变原字符串</strong>，跟<strong>slice</strong>方法很相像。<br>第一个参数表示子字符串的开始位置，第二个位置表示结束位置（返回结果不含该位置）。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'JavaScript'</span>.substring(<span class="number">0</span>, <span class="number">4</span>)  <span class="comment">// "Java"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果省略第二个参数，则表示子字符串一直到原字符串的结束</span></span><br><span class="line"><span class="string">'JavaScript'</span>.substring(<span class="number">4</span>)  <span class="comment">// "Script"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果第二个参数大于第一个参数，substring方法会自动更换两个参数的位置</span></span><br><span class="line"><span class="string">'JavaScript'</span>.substring(<span class="number">10</span>, <span class="number">4</span>) <span class="comment">// "Script"</span></span><br><span class="line"><span class="comment">// 等同于</span></span><br><span class="line"><span class="string">'JavaScript'</span>.substring(<span class="number">4</span>, <span class="number">10</span>) <span class="comment">// "Script"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果参数是负数，substring方法会自动将负数转为0</span></span><br><span class="line"><span class="string">'Javascript'</span>.substring(<span class="number">-3</span>) <span class="comment">// "JavaScript"</span></span><br><span class="line"><span class="string">'JavaScript'</span>.substring(<span class="number">4</span>, <span class="number">-3</span>) <span class="comment">// "Java"</span></span><br></pre></td></tr></table></figure></p>
<h3 id="1-6-String-prototype-substr"><a href="#1-6-String-prototype-substr" class="headerlink" title="1.6 String.prototype.substr()"></a>1.6 String.prototype.substr()</h3><p>用于从原字符串取出子字符串并返回，<strong>不改变原字符串</strong>，跟slice和substring方法的作用相同<br>第一个参数是子字符串的开始位置（从0开始计算），<br>第二个参数是子字符串的长度。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'JavaScript'</span>.substr(<span class="number">4</span>, <span class="number">6</span>) <span class="comment">// "Script"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果省略第二个参数，则表示子字符串一直到原字符串的结束</span></span><br><span class="line"><span class="string">'JavaScript'</span>.substr(<span class="number">4</span>) <span class="comment">// "Script"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果第一个参数是负数，表示倒数计算的字符位置。如果第二个参数是负数，将被自动转为0，因此会返回空字符串。</span></span><br><span class="line"><span class="string">'JavaScript'</span>.substr(<span class="number">-6</span>) <span class="comment">// "Script"</span></span><br><span class="line"><span class="string">'JavaScript'</span>.substr(<span class="number">4</span>, <span class="number">-1</span>) <span class="comment">// ""</span></span><br></pre></td></tr></table></figure></p>
<h3 id="1-7-String-prototype-indexOf-，String-prototype-lastIndexOf"><a href="#1-7-String-prototype-indexOf-，String-prototype-lastIndexOf" class="headerlink" title="1.7 String.prototype.indexOf()，String.prototype.lastIndexOf()"></a>1.7 String.prototype.indexOf()，String.prototype.lastIndexOf()</h3><p>indexOf方法用于确定一个字符串在另一个字符串中<strong>第一次</strong>出现的位置，返回结果是匹配开始的位置，如果返回-1，就表示不匹配<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'hello world'</span>.indexOf(<span class="string">'o'</span>) <span class="comment">// 4</span></span><br><span class="line"><span class="string">'JavaScript'</span>.indexOf(<span class="string">'script'</span>) <span class="comment">// -1</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//indexOf方法还可以接受第二个参数，表示从该位置开始向后匹配</span></span><br><span class="line"><span class="string">'hello world'</span>.indexOf(<span class="string">'o'</span>, <span class="number">6</span>) <span class="comment">// 7</span></span><br></pre></td></tr></table></figure></p>
<p>lastIndexOf方法的用法跟indexOf方法一致，主要区别是lastIndexOf从尾部开始匹配，indexOf则是从头部开始匹配。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'hello world'</span>.lastIndexOf(<span class="string">'o'</span>) <span class="comment">// 7</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//lastIndexOf的第二个参数表示从该位置起向前匹配</span></span><br><span class="line"><span class="string">'hello world'</span>.lastIndexOf(<span class="string">'o'</span>, <span class="number">6</span>) <span class="comment">// 4</span></span><br></pre></td></tr></table></figure></p>
<h3 id="1-8-String-prototype-trim"><a href="#1-8-String-prototype-trim" class="headerlink" title="1.8 String.prototype.trim()"></a>1.8 String.prototype.trim()</h3><p>用于去除字符串两端的空格，返回一个新字符串，<strong>不改变原字符串</strong><br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'  hello world  '</span>.trim()  <span class="comment">// "hello world"</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//该方法去除的不仅是空格，还包括制表符（\t、\v）、换行符（\n）和回车符（\r）</span></span><br></pre></td></tr></table></figure></p>
<h3 id="1-9-String-prototype-toLowerCase-，String-prototype-toUpperCase"><a href="#1-9-String-prototype-toLowerCase-，String-prototype-toUpperCase" class="headerlink" title="1.9 String.prototype.toLowerCase()，String.prototype.toUpperCase()"></a>1.9 String.prototype.toLowerCase()，String.prototype.toUpperCase()</h3><p>toLowerCase方法用于将一个字符串全部转为小写，<br>toUpperCase则是全部转为大写。<br>它们都返回一个新字符串，<strong>不改变原字符串</strong>。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'Hello World'</span>.toLowerCase()</span><br><span class="line"><span class="comment">// "hello world"</span></span><br><span class="line"></span><br><span class="line"><span class="string">'Hello World'</span>.toUpperCase()</span><br><span class="line"><span class="comment">// "HELLO WORLD"</span></span><br></pre></td></tr></table></figure></p>
<h3 id="2-0-String-prototype-match"><a href="#2-0-String-prototype-match" class="headerlink" title="2.0 String.prototype.match()"></a>2.0 String.prototype.match()</h3><p>用于确定原字符串是否匹配某个子字符串，返回一个数组，成员为<strong>匹配的第一个字符串</strong>，如果没有匹配，则返回null。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'cat, bat, sat, fat'</span>.match(<span class="string">'at'</span>) <span class="comment">// ["at"]</span></span><br><span class="line"><span class="string">'cat, bat, sat, fat'</span>.match(<span class="string">'xt'</span>) <span class="comment">// null</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//返回的数组还有index属性和input属性，分别表示匹配字符串开始的位置和原始字符串</span></span><br><span class="line"><span class="keyword">var</span> matches = <span class="string">'cat, bat, sat, fat'</span>.match(<span class="string">'at'</span>);</span><br><span class="line">matches.index <span class="comment">// 1</span></span><br><span class="line">matches.input <span class="comment">// "cat, bat, sat, fat"</span></span><br></pre></td></tr></table></figure></p>
<h3 id="2-1-String-prototype-search-，String-prototype-replace"><a href="#2-1-String-prototype-search-，String-prototype-replace" class="headerlink" title="2.1 String.prototype.search()，String.prototype.replace()"></a>2.1 String.prototype.search()，String.prototype.replace()</h3><p>search方法的用法基本等同于match，但是返回值为匹配的第一个位置。如果没有找到匹配，则返回-1。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'cat, bat, sat, fat'</span>.search(<span class="string">'at'</span>) <span class="comment">// 1</span></span><br></pre></td></tr></table></figure></p>
<p>replace方法用于替换匹配的子字符串，一般情况下只替换第一个匹配（除非使用带有g修饰符的正则表达式）。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'aaa'</span>.replace(<span class="string">'a'</span>, <span class="string">'b'</span>) <span class="comment">// "baa"</span></span><br></pre></td></tr></table></figure></p>
<h3 id="2-2-String-prototype-split"><a href="#2-2-String-prototype-split" class="headerlink" title="2.2 String.prototype.split()"></a>2.2 String.prototype.split()</h3><p>split方法按照给定规则分割字符串，返回一个由分割出来的子字符串组成的数组。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'a|b|c'</span>.split(<span class="string">'|'</span>)   <span class="comment">// ["a", "b", "c"]</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果分隔规则为空字符串，则返回原字符串的每一个字符</span></span><br><span class="line"><span class="string">'a|b|c'</span>.split(<span class="string">''</span>) <span class="comment">// ["a", "|", "b", "|", "c"]</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果省略参数，则返回数组的唯一成员就是原字符串</span></span><br><span class="line"><span class="string">'a|b|c'</span>.split() <span class="comment">// ["a|b|c"]</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果满足分割规则的两个部分紧邻着（即两个分割符中间没有其他字符），则返回数组之中会有一个空字符串</span></span><br><span class="line"><span class="string">'a||c'</span>.split(<span class="string">'|'</span>) <span class="comment">// ['a', '', 'c']</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//如果满足分割规则的部分处于字符串的开头或结尾（即它的前面或后面没有其他字符），则返回数组的第一个或最后一个成员是一个空字符串</span></span><br><span class="line"><span class="string">'|b|c'</span>.split(<span class="string">'|'</span>) <span class="comment">// ["", "b", "c"]</span></span><br><span class="line"><span class="string">'a|b|'</span>.split(<span class="string">'|'</span>) <span class="comment">// ["a", "b", ""]</span></span><br><span class="line"></span><br><span class="line"><span class="comment">//split方法还可以接受第二个参数，限定返回数组的最大成员数</span></span><br><span class="line"><span class="string">'a|b|c'</span>.split(<span class="string">'|'</span>, <span class="number">0</span>) <span class="comment">// []</span></span><br><span class="line"><span class="string">'a|b|c'</span>.split(<span class="string">'|'</span>, <span class="number">1</span>) <span class="comment">// ["a"]</span></span><br><span class="line"><span class="string">'a|b|c'</span>.split(<span class="string">'|'</span>, <span class="number">2</span>) <span class="comment">// ["a", "b"]</span></span><br><span class="line"><span class="string">'a|b|c'</span>.split(<span class="string">'|'</span>, <span class="number">3</span>) <span class="comment">// ["a", "b", "c"]</span></span><br><span class="line"><span class="string">'a|b|c'</span>.split(<span class="string">'|'</span>, <span class="number">4</span>) <span class="comment">// ["a", "b", "c"]</span></span><br></pre></td></tr></table></figure></p>
<h3 id="2-3-String-prototype-localeCompare"><a href="#2-3-String-prototype-localeCompare" class="headerlink" title="2.3 String.prototype.localeCompare()"></a>2.3 String.prototype.localeCompare()</h3><p>用于比较两个字符串。它返回一个整数，<br>如果小于0，表示第一个字符串小于第二个字符串；<br>如果等于0，表示两者相等；<br>如果大于0，表示第一个字符串大于第二个字符串。</p>
<h2 id="二、String实例属性"><a href="#二、String实例属性" class="headerlink" title="二、String实例属性"></a>二、String实例属性</h2><p>String.prototype.length<br>返回字符串的长度<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="string">'abc'</span>.length  <span class="comment">//3</span></span><br></pre></td></tr></table></figure></p>
<h2 id="三、String静态方法"><a href="#三、String静态方法" class="headerlink" title="三、String静态方法"></a>三、String静态方法</h2><p>String.fromCharCode()<br>该方法参数是一个或多个数值，代表Unicode码点，返回值是这些码点组成的字符串。<br><figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">String</span>.fromCharCode()  <span class="comment">// ""</span></span><br><span class="line"><span class="built_in">String</span>.fromCharCode(<span class="number">97</span>)  <span class="comment">// "a"</span></span><br><span class="line"><span class="built_in">String</span>.fromCharCode(<span class="number">104</span>, <span class="number">101</span>, <span class="number">108</span>, <span class="number">108</span>, <span class="number">111</span>)  <span class="comment">// "hello"</span></span><br></pre></td></tr></table></figure></p>

      
    </div>
    
    
    

    

    

    

    <footer class="post-footer">
      
        <div class="post-tags">
          
            <a href="/reimupage/tags/JavaScript/" rel="tag"># JavaScript</a>
          
            <a href="/reimupage/tags/String/" rel="tag"># String</a>
          
        </div>
      

      
      
      

      
        <div class="post-nav">
          <div class="post-nav-next post-nav-item">
            
              <a href="/reimupage/2018/05/06/RegExp对象/" rel="next" title="正则表达式 笔记">
                <i class="fa fa-chevron-left"></i> 正则表达式 笔记
              </a>
            
          </div>

          <span class="post-nav-divider"></span>

          <div class="post-nav-prev post-nav-item">
            
              <a href="/reimupage/2018/05/07/JSONP/" rel="prev" title="JSONP 笔记">
                JSONP 笔记 <i class="fa fa-chevron-right"></i>
              </a>
            
          </div>
        </div>
      

      
      
    </footer>
  </div>
  
  
  
  </article>



    <div class="post-spread">
      
    </div>
  </div>


          </div>
          


          

  



        </div>
        
          
  
  <div class="sidebar-toggle">
    <div class="sidebar-toggle-line-wrap">
      <span class="sidebar-toggle-line sidebar-toggle-line-first"></span>
      <span class="sidebar-toggle-line sidebar-toggle-line-middle"></span>
      <span class="sidebar-toggle-line sidebar-toggle-line-last"></span>
    </div>
  </div>

  <aside id="sidebar" class="sidebar">
    
    <div class="sidebar-inner">

      

      
        <ul class="sidebar-nav motion-element">
          <li class="sidebar-nav-toc sidebar-nav-active" data-target="post-toc-wrap">
            文章目录
          </li>
          <li class="sidebar-nav-overview" data-target="site-overview-wrap">
            站点概览
          </li>
        </ul>
      

      <section class="site-overview-wrap sidebar-panel">
        <div class="site-overview">
          <div class="site-author motion-element" itemprop="author" itemscope itemtype="http://schema.org/Person">
            
              <img class="site-author-image" itemprop="image"
                src="/reimupage/images/avatar.gif"
                alt="Reimu" />
            
              <p class="site-author-name" itemprop="name">Reimu</p>
              <p class="site-description motion-element" itemprop="description"></p>
          </div>

          <nav class="site-state motion-element">

            
              <div class="site-state-item site-state-posts">
              
                <a href="/reimupage/archives/">
              
                  <span class="site-state-item-count">6</span>
                  <span class="site-state-item-name">日志</span>
                </a>
              </div>
            

            
              
              
              <div class="site-state-item site-state-categories">
                
                  <span class="site-state-item-count">2</span>
                  <span class="site-state-item-name">分类</span>
                
              </div>
            

            
              
              
              <div class="site-state-item site-state-tags">
                
                  <span class="site-state-item-count">6</span>
                  <span class="site-state-item-name">标签</span>
                
              </div>
            

          </nav>

          

          

          
          

          
          

          

        </div>
      </section>

      
      <!--noindex-->
        <section class="post-toc-wrap motion-element sidebar-panel sidebar-panel-active">
          <div class="post-toc">

            
              
            

            
              <div class="post-toc-content"><ol class="nav"><li class="nav-item nav-level-1"><a class="nav-link" href="#String对象-笔记"><span class="nav-number">1.</span> <span class="nav-text">String对象 笔记</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#前言"><span class="nav-number">2.</span> <span class="nav-text">前言</span></a></li><li class="nav-item nav-level-1"><a class="nav-link" href="#正文"><span class="nav-number">3.</span> <span class="nav-text">正文</span></a><ol class="nav-child"><li class="nav-item nav-level-2"><a class="nav-link" href="#一、String实例方法"><span class="nav-number">3.1.</span> <span class="nav-text">一、String实例方法</span></a><ol class="nav-child"><li class="nav-item nav-level-3"><a class="nav-link" href="#1-1-String-prototype-charAt"><span class="nav-number">3.1.1.</span> <span class="nav-text">1.1 String.prototype.charAt()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-2-String-prototype-charCodeAt"><span class="nav-number">3.1.2.</span> <span class="nav-text">1.2 String.prototype.charCodeAt()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-3-String-prototype-concat"><span class="nav-number">3.1.3.</span> <span class="nav-text">1.3 String.prototype.concat()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-4-String-prototype-slice"><span class="nav-number">3.1.4.</span> <span class="nav-text">1.4 String.prototype.slice()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-5-String-prototype-substring"><span class="nav-number">3.1.5.</span> <span class="nav-text">1.5 String.prototype.substring()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-6-String-prototype-substr"><span class="nav-number">3.1.6.</span> <span class="nav-text">1.6 String.prototype.substr()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-7-String-prototype-indexOf-，String-prototype-lastIndexOf"><span class="nav-number">3.1.7.</span> <span class="nav-text">1.7 String.prototype.indexOf()，String.prototype.lastIndexOf()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-8-String-prototype-trim"><span class="nav-number">3.1.8.</span> <span class="nav-text">1.8 String.prototype.trim()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#1-9-String-prototype-toLowerCase-，String-prototype-toUpperCase"><span class="nav-number">3.1.9.</span> <span class="nav-text">1.9 String.prototype.toLowerCase()，String.prototype.toUpperCase()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#2-0-String-prototype-match"><span class="nav-number">3.1.10.</span> <span class="nav-text">2.0 String.prototype.match()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#2-1-String-prototype-search-，String-prototype-replace"><span class="nav-number">3.1.11.</span> <span class="nav-text">2.1 String.prototype.search()，String.prototype.replace()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#2-2-String-prototype-split"><span class="nav-number">3.1.12.</span> <span class="nav-text">2.2 String.prototype.split()</span></a></li><li class="nav-item nav-level-3"><a class="nav-link" href="#2-3-String-prototype-localeCompare"><span class="nav-number">3.1.13.</span> <span class="nav-text">2.3 String.prototype.localeCompare()</span></a></li></ol></li><li class="nav-item nav-level-2"><a class="nav-link" href="#二、String实例属性"><span class="nav-number">3.2.</span> <span class="nav-text">二、String实例属性</span></a></li><li class="nav-item nav-level-2"><a class="nav-link" href="#三、String静态方法"><span class="nav-number">3.3.</span> <span class="nav-text">三、String静态方法</span></a></li></ol></li></ol></div>
            

          </div>
        </section>
      <!--/noindex-->
      

      

    </div>
  </aside>


        
      </div>
    </main>

    <footer id="footer" class="footer">
      <div class="footer-inner">
        <div class="copyright">&copy; <span itemprop="copyrightYear">2018</span>
  <span class="with-love">
    <i class="fa fa-user"></i>
  </span>
  <span class="author" itemprop="copyrightHolder">Reimu</span>

  
</div>


  <div class="powered-by">由 <a class="theme-link" target="_blank" href="https://hexo.io">Hexo</a> 强力驱动</div>



  <span class="post-meta-divider">|</span>



  <div class="theme-info">主题 &mdash; <a class="theme-link" target="_blank" href="https://github.com/iissnan/hexo-theme-next">NexT.Pisces</a> v5.1.4</div>




        







        
      </div>
    </footer>

    
      <div class="back-to-top">
        <i class="fa fa-arrow-up"></i>
        
      </div>
    

    

  </div>

  

<script type="text/javascript">
  if (Object.prototype.toString.call(window.Promise) !== '[object Function]') {
    window.Promise = null;
  }
</script>









  


  











  
  
    <script type="text/javascript" src="/reimupage/lib/jquery/index.js?v=2.1.3"></script>
  

  
  
    <script type="text/javascript" src="/reimupage/lib/fastclick/lib/fastclick.min.js?v=1.0.6"></script>
  

  
  
    <script type="text/javascript" src="/reimupage/lib/jquery_lazyload/jquery.lazyload.js?v=1.9.7"></script>
  

  
  
    <script type="text/javascript" src="/reimupage/lib/velocity/velocity.min.js?v=1.2.1"></script>
  

  
  
    <script type="text/javascript" src="/reimupage/lib/velocity/velocity.ui.min.js?v=1.2.1"></script>
  

  
  
    <script type="text/javascript" src="/reimupage/lib/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
  

  
  
    <script type="text/javascript" src="/reimupage/lib/canvas-nest/canvas-nest.min.js"></script>
  


  


  <script type="text/javascript" src="/reimupage/js/src/utils.js?v=5.1.4"></script>

  <script type="text/javascript" src="/reimupage/js/src/motion.js?v=5.1.4"></script>



  
  


  <script type="text/javascript" src="/reimupage/js/src/affix.js?v=5.1.4"></script>

  <script type="text/javascript" src="/reimupage/js/src/schemes/pisces.js?v=5.1.4"></script>



  
  <script type="text/javascript" src="/reimupage/js/src/scrollspy.js?v=5.1.4"></script>
<script type="text/javascript" src="/reimupage/js/src/post-details.js?v=5.1.4"></script>



  


  <script type="text/javascript" src="/reimupage/js/src/bootstrap.js?v=5.1.4"></script>



  


  




	





  





  












  





  

  

  

  
  

  

  

  

</body>
</html>
